/**
 *
 * Copyright 2017-present scrm
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 */
import React from 'react';
import PropTypes from 'prop-types';
import { Platform, StyleSheet, ViewPropTypes, Text, View} from 'react-native';
import Divider from '../divider/Divider';

const propTypes = {
  title: PropTypes.string,
  titleStyle: ViewPropTypes.style,
  fontFamily: PropTypes.string,
  containerStyle: ViewPropTypes.style,
  titleWrapperStyle: ViewPropTypes.style,
  children: PropTypes.any,
  wrapperStyle: ViewPropTypes.style
};

const MenuCard = ({
  title,
  titleStyle,
  fontFamily,
  containerStyle,
  titleWrapperStyle,
  wrapperStyle,
  children
}) => (
  <View
  style={[
        styles.container,
        containerStyle && containerStyle,
      ]}
  >
    <View
    style={[
          styles.titleWrapperStyle,
          titleWrapperStyle && titleWrapperStyle,
        ]}
    >
      <Text
        style={[
          styles.cardTitle,
          titleStyle && titleStyle,
          fontFamily && { fontFamily }
        ]}
      >
        {title}
      </Text>
    </View>
    <Divider></Divider>
    <View style={[wrapperStyle && wrapperStyle]}>
      {children}
    </View>
  </View>
);

MenuCard.propTypes = propTypes;

MenuCard.defaultProps = {
  title: null
};

const styles = StyleSheet.create({
  container: {
  },
  cardTitle: {
    textAlign: 'left'
  },
  titleWrapperStyle: {
    paddingTop: 15,
    paddingLeft: 10,
    paddingBottom: 10
  }
});

export default MenuCard;
